:global {
    .z-full-layer {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        overflow: hidden;
        z-index: 1000;
        $--h: 128px;
        $--top: $--h/2;
        opacity: 1;
        display: none;
        transition: all 0.25s;
        &.transparent {
            opacity: 0;
        }
        .close {
            z-index: 99;
            background-color: rgba(56, 56, 56, 0.7);
            cursor: pointer;
            position: absolute;
            width: 32px;
            height: 32px;
            top: 8px;
            right: 20px;
            border-radius: 4px;
            transition: background-color 0.15s;
            display: flex;
            justify-content: center;
            align-items: center;
            &:hover {
                background-color: rgba(56, 56, 56, 1);
            }
            &::before {
                background-image: url('');
                background-repeat: no-repeat;
                background-size: 280px;
                color: transparent;
                display: block;
                font-size: 0;
                height: 20px;
                width: 20px;
                line-height: 0;
                background-position: -260px 0;
                content: 'Close';
                position: relative;
                top: auto;
                left: auto;
                bottom: auto;
                right: auto;
            }
        }
        &.dark {
            .close {
                background-color: rgba(177, 177, 177, 0.5);

                &:hover {
                    background-color: rgba(177, 177, 177, 0.8);
                }
            }
        }
        .z-full-layer-heading {
            height: $--top;
            // padding:0 $--top 0 20px;
        }
        .z-full-layer-body {
            // height: calc(100% - #{$--top});
            height: 100%;
            overflow: auto;
            transition: all 0.25s;
            opacity: 1;
            &.scale {
                transform-origin: center center;
                transform: scale(0);
                opacity: 0;
            }
        }
        &.normal .z-full-layer-heading {
            border-bottom: 1px solid #cccccc;
        }
        &.normal .z-full-layer-heading,
        &.normal .z-full-layer-body {
            background-color: white;
        }
        &.normal .close {
            color: #666666;
        }
        &.dark {
            .z-full-layer-body::-webkit-scrollbar-track,
            .z-body-scroll::-webkit-scrollbar-track {
                background: transparent;
            }
        }
    }
}
